<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" th:href="@{css/jquery.mobile-1.4.5.min.css}">
    <link rel="stylesheet" th:href="@{css/register.css}">
    <script th:src="@{js/jquery.js}"></script>
    <script th:src="@{js/jquery.mobile-1.4.5.min.js}"></script>
    <script th:src="@{js/register.js}"></script>
</head>
<body>
    <div data-role="page">
        <div data-role="header" data-position="fixed">
          <img th:src="@{images/logo.png}" alt="" class="logo">
          <h1>注册</h1>
        </div>
      
        <div data-role="main" class="ui-content">
          <form method="post" th:action="@{index.html}" data-ajax=false>

            <label for="name">昵称：</label>
            <input type="text" name="name" id="name" placeholder="输入昵称" required>
            <label for="email">邮箱：</label>
            <input type="email" name="pwd" id="email" placeholder="绑定邮箱" required>
            <label for="points">年龄:</label>
            <input type="range" name="points" id="points" value="50" min="0" max="100">
            <p>性别：</p>
            <label for="male">男性</label>
            <input type="radio" name="gender" id="male" value="male">
            <label for="female">女性</label>
            <input type="radio" name="gender" id="female" value="female"> 
            <p>选择您喜欢的颜色：</p>
            <label for="red">红色</label>
            <input type="checkbox" name="favcolor" id="red" value="red">
            <label for="green">绿色</label>
            <input type="checkbox" name="favcolor" id="green" value="green">
            <label for="blue">蓝色</label>
            <input type="checkbox" name="favcolor" id="blue" value="blue">

            <input type="submit" data-inline="true" value="提交" >
          </form>
        </div>
      
        <div data-role="footer" data-position="fixed">
            <div data-role="navbar">
                <ul>
                    <li><a th:href="@{#}" data-icon="comment" class="autoCli" data-ajax=false>消息</a></li>
                    <li><a th:href="@{friends.html}" data-icon="user" data-ajax=false>联系人</a></li>
                    <li><a th:href="@{account/info.html}" data-icon="info" data-ajax=false>个人信息</a></li>
                </ul>
              </div>
        </div>
    </div> 
</body>
</html>